<!doctype html>
<html>

  <head>
    <meta charset="UTF-8">
    <title></title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link href="../css/mui.min.css" rel="stylesheet" />
    <link rel="stylesheet" type="text/css" href="../css/weui.min.css" />
    <style type="text/css">
      html {
        font-family: Roboto, Arial, "Noto Sans CJK SC", "Noto Sans CJK TC", "Pingfang SC", "Microsoft Yahei", "WenQuanYi Micro Hei", sans-serif;
      }
      
      body {
        overflow-x: hidden;
        background-color: #fff !important;
      }
      
      #app {
        font-size: 14px;
        box-sizing: border-box;
      }
      
      .receive-option {
        padding: 10px 5px;
        margin: 10px;
      }
      
      .empty {
        text-align: center;
        margin-top: 50px;
        color: #999;
        font-size: 12px;
      }
      .vux-1px{
      	border: 1px dashed #ccc;
      	border-radius: 5px;
      }
    </style>
  </head>

  <body>
    <script src="../js/mui.min.js"></script>
    <script type="text/javascript">
      mui.init({
        beforeback: function() {
          var main = plus.webview.getWebviewById('main');
          mui.fire(main, 'refresh');
          return true;
        }
      });
    </script>
    <div id="app">
      <div class="mui-scroll-wrapper">
        <div class="mui-scroll">
          <p class="empty" v-if="list && list.length === 0">暂无订单</p>
          <div v-for="(item, index) in list" class="weui-flex">
            <div v-for="(innerItem, innerIndex) in item" class="weui-flex__item receive-option" @click="receiveDetail(innerItem)" :class="{'vux-1px': typeof innerItem.conversionAmount !== 'undefined'}">
              <div v-if="typeof innerItem.conversionAmount !== 'undefined'">
                <div v-text="innerItem.conversionId"></div>
                <div>货品数量：<span v-text="innerItem.conversionAmount"></span></div>
                <div>货品款式：<span v-text="innerItem.conversionStyle"></span></div>
                <div>转场门店：<span v-text="innerItem.storeName"></span></div>
              </div>
            </div>
          </div>

        </div>
      </div>

    </div>

    <script src="../js/vue.min.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
      mui.plusReady(function() {
        var vm = new Vue({
          el: "#app",
          data: {
            currentShopObj: {},
            fromTime: '',
            toTime: '',
            shopReceiveList: [],
            shopObjs: []
          },
          computed: {
            list: function() {
              var arr = [];
              for(var i = 0; i < this.shopReceiveList.length; i += 2) {
                var innerArr = [this.shopReceiveList[i]]
                if(this.shopReceiveList[i + 1]) {
                  innerArr.push(this.shopReceiveList[i + 1]);
                } else {
                  innerArr.push({});
                }
                arr.push(innerArr);
              }
              return arr;
            }
          },
          created: function() {
            this.receiveParmas();
          },
          mounted: function() {
            this.fixScroll();
            var _this = this;
            window.addEventListener('refresh', _this.fresh);
            window.addEventListener('receiveParams', _this.receiveFreshParams);
          },
          methods: {
            fixScroll: function() {
              mui('.mui-scroll-wrapper').scroll({
                deceleration: 0.0005,
                brounce: true,
                scrollY: true
              });
            },
            receiveParmas: function() {
              var self = plus.webview.currentWebview();
              this.currentShopObj = self.currentShopObj;
              this.fromTime = self.fromTime;
              this.toTime = self.toTime;
              this.shopReceiveList = self.shopReceiveList;
              this.shopObjs = self.shopObjs;
            },
            fresh: function() {
              var main = plus.webview.getWebviewById('main');
              mui.fire(main, 'refresh');
            },
            receiveFreshParams: function(e) {
              vm.fromTime = e.detail.fromTime ? e.detail.fromTime : vm.fromTime;
              vm.toTime = e.detail.toTime ? e.detail.toTime : vm.toTime;
              vm.shopReceiveList = e.detail.shopReceiveList ? e.detail.shopReceiveList : vm.shopReceiveList;
              vm.shopObjs = e.detail.shopObjs ? e.detail.shopObjs : vm.shopObjs;
            },
            receiveDetail: function(innerItem) {
              mui.openWindow({
                url: 'shop-list.html',
                id: 'shop-list',
                styles: {
                  titleNView: {
                    titleText: vm.currentShopObj.storeName + '收货',
                    titleColor: "#FFFFFF",
                    titleSize: "18px",
                    backgroundColor: "#FF6800",
                    autoBackButton: true,
                    buttons: [{
                      fontWeight: 600,
                      fontSize: '14px',
                      float: 'right',
                      fontSrc: "_www/fonts/iconfont.ttf", //wap2app内置字体文件
                      text: "\ue602",
                      onclick: function() {
                        var allPage = plus.webview.all()
                        var nowPage = plus.webview.getWebviewById('index')
                        for(var i = 0; i < allPage.length; i++) {
                          if(allPage[i].getURL() !== nowPage.getURL()) {
                            plus.webview.close(allPage[i]);
                          }
                        }
                      }
                    }],
                    splitLine: {
                      color: "#CCCCCC",
                      height: "1px"
                    }
                  }
                },
                extras: {
                  conversionId: innerItem.conversionId,
                  currentShopObj: vm.currentShopObj,
                  shopObjs: vm.shopObjs
                }
              });
            }
          },
          beforeDestroy: function() {
            var _this = this;
            window.removeEventListener('refresh', _this.fresh);
            window.removeEventListener('receiveParams', _this.receiveFreshParams);
          }
        });
      });
    </script>
  </body>

</html>